<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:f="http://java.sun.com/jsf/core" 
      xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:p="http://primefaces.prime.com.tr/ui"
      >
    <h:head>
        <title>Modify Venue Layout</title>
    </h:head>
    <h:body>
        <h1>Stakeholder Account and Billing Management (TCube)</h1> 
        <p:layout style="table-layout:auto; height:700px ">
            <p:layoutUnit position="left" header="Navigation" width="300">
                <h:form id="StakeholderMenu">
                    <h:commandLink value="Add Event" action="addevent.xhtml?faces-redirect=true"/>
                    <br/>
                    <h:commandLink value="Delete Event" action="deleteevent.xhtml?faces-redirect=true"/>
                    <br/>
                    <h:commandLink value="Modify Event" action="modifyevent.xhtml?faces-redirect=true"/>
                    <br/>
                    <h:commandLink value="Add Show" action="addshow.xhtml?faces-redirect=true"/>
                    <br/>
                    <h:commandLink value="Delete Show" action="deleteshow.xhtml?faces-redirect=true"/>
                    <br/>
                    <h:commandLink value="Modify Show" action="modifyshow.xhtml?faces-redirect=true"/>
                    <br/>
                    <h:commandLink value="Add Area" action="addarea.xhtml?faces-redirect=true"/>
                    <br/>
                    <h:commandLink value="Delete Area" action="addarea.xhtml?faces-redirect=true"/>
                    <br/>
                    <h:commandLink value="Modify area" action="modifyarea.xhtml?faces-redirect=true"/>
                    <br/>
                    <h:commandLink value="Delete Poster" action="deleteposter.xhtml?faces-redirect=true"/>
                    <br/>
                </h:form>
            </p:layoutUnit>
            <p:layoutUnit position="center" header="Add new Event" scrollable="true">
                <h:form id="eventUpdateForm">
                    <p:ajaxStatus style="width:16px;height:16px;">
                        <f:facet name="start">
                            <h:graphicImage value="http://www.primefaces.org:8080/showcase/design/ajaxloading.gif" />
                        </f:facet>
                        <f:facet name="complete">
                            <h:outputText value="" />
                        </f:facet>
                    </p:ajaxStatus>
                    <p:dataTable value="#{stakeholderPerformanceMB.getAllEvents()}" var="event"
                        onRowSelectUpdate="eventUpdateForm" selectionMode="single"
                        selection="#{stakeholderPerformanceMB.eventHelper}" 
                        rowSelectListener="#{stakeholderPerformanceMB.updateSelectedEventFields()}"
                        styleClass="order-table" paginator="true" rows="5"
                        >
                        <p:column>
                            <f:facet name="header">Event ID</f:facet>
                            <h:outputText id="eventId" value="#{event.id}" />
                        </p:column>
                        
                        <p:column>
                            <f:facet name="header">Name</f:facet>
                            <h:outputText id="eventName" value="#{event.eventName}" />
                        </p:column>

                        <h:inputHidden id="eventDescription" value="#{event.description}"  />
                        
                        <h:inputHidden id="posterPath" value="#{event.poster}" />

                        <p:column>
                            <f:facet name="header">Rating</f:facet>         
                            <h:outputText id="eventRating" value="#{event.rating}" />
                        </p:column>

                        <p:column>
                            <f:facet name="header">Language</f:facet>
                            <h:outputText id="eventLanguage" value="#{event.language}" />
                        </p:column>
    
                        <p:column>
                            <f:facet name="header">Type</f:facet>
                            <h:outputText id="eventGenre" value="#{event.genre}" />
                        </p:column>

                        <p:column>
                            <f:facet name="header">Duration</f:facet>
                            <h:outputText id="eventDuration" value="#{event.duration}" />
                        </p:column>
                        
                        <p:column>
                            <f:facet name="header">Start Date</f:facet>
                            <h:outputText id="eventStartDate" value="#{event.startDate}" />
                        </p:column>

                        <p:column>
                            <f:facet name="header">End Date</f:facet>
                            <h:outputText id="eventEndDate" value="#{event.endDate}" />
                        </p:column>
                        
                    </p:dataTable>
                    <br/>

                    <h3>Click on a row above to see/remove a poster from an event</h3>
                    <p:panel id="panel" >
                        <p:ajaxStatus style="width:16px;height:16px;">
                            <f:facet name="start">
                                <h:graphicImage value="http://www.primefaces.org:8080/showcase/design/ajaxloading.gif" />
                            </f:facet>
                            <f:facet name="complete">
                                <h:outputText value="" />
                            </f:facet>
                        </p:ajaxStatus>
                        <p:messages />
                        <h:panelGrid columns="2" border="0">
                            <h:outputLabel for="eventName" value="Name:"/>
                            <h:outputText id="eventSelectedName" value="#{stakeholderPerformanceMB.eventName}" style="width: 500px"/>
                            
                            <h:outputLabel for="posterPath" value="Poster: "/>
                            <p:graphicImage value="#{stakeholderPerformanceMB.posterPath}" width="300" height="400"/>
                            
                        </h:panelGrid>
                        <br/>
                        <h:commandButton id="submitEvent" value="Remove Poster" onclick="if (!confirm('Are you sure you want to remove the poster of this event?')) return false"
                                         action="#{stakeholderPerformanceMB.removePoster(stakeholderPerformanceMB.eventId)}" >
                         </h:commandButton>
                    </p:panel>
                    
                </h:form>
            </p:layoutUnit>
        </p:layout>
    </h:body>
</html>

